<!--&lt;!&ndash;-->
<!-- * @Description:-->
<!-- * @Author: Rabbiter-->
<!-- * @Date: 2023-03-08 20:38:49-->
<!--&ndash;&gt;-->
<!--&lt;!&ndash; 添加教师 &ndash;&gt;-->
<!--<template>-->
<!--  <section class="add">-->
<!--    <el-form ref="form" :model="form" label-width="80px">-->
<!--      <el-form-item label="姓名">-->
<!--            <el-input v-model="form.teacherName"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="学院">-->
<!--            <el-input v-model="form.institute"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="性别">-->
<!--            <el-input v-model="form.sex"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="电话号码">-->
<!--            <el-input v-model="form.tel"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="密码">-->
<!--            <el-input v-model="form.pwd"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="身份证号">-->
<!--            <el-input v-model="form.cardId"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="职称">-->
<!--            <el-input v-model="form.type"></el-input>-->
<!--          </el-form-item>-->
<!--      <el-form-item>-->
<!--        <el-button type="primary" @click="onSubmit()" icon="el-icon-a-07">立即创建</el-button>-->
<!--        <el-button type="danger" @click="cancel()" icon="el-icon-a-022">取消</el-button>-->
<!--      </el-form-item>-->
<!--    </el-form>-->
<!--  </section>-->
<!--</template>-->

<!--<script>-->
<!--export default {-->
<!--  data() {-->
<!--    return {-->
<!--      form: { //表单数据初始化-->
<!--        studentName: null,-->
<!--        grade: null,-->
<!--        major: null,-->
<!--        clazz: null,-->
<!--        institute: null,-->
<!--        tel: null,-->
<!--        email: null,-->
<!--        pwd: null,-->
<!--        cardId: null,-->
<!--        sex: null,-->
<!--        role: 2-->
<!--      }-->
<!--    };-->
<!--  },-->
<!--  methods: {-->
<!--    onSubmit() { //数据提交-->
<!--      this.$axios({-->
<!--        url: '/api/teacher',-->
<!--        method: 'post',-->
<!--        data: {-->
<!--          ...this.form-->
<!--        }-->
<!--      }).then(res => {-->
<!--        if(res.data.code == 200) {-->
<!--          this.$message({-->
<!--            message: '数据添加成功',-->
<!--            type: 'success'-->
<!--          })-->
<!--          this.$router.push({path: '/teacherManage'})-->
<!--        }-->
<!--      })-->
<!--    },-->
<!--    cancel() { //取消按钮-->
<!--      this.form = {}//重置表单数据-->
<!--      //返回上一级页面-->
<!--      // window.history.back();-->
<!--    },-->

<!--  }-->
<!--};-->
<!--</script>-->
<!--<style lang="less" scoped>-->
<!--.add {-->
<!--  padding: 0px 40px;-->
<!--  width: 400px;-->
<!--}-->
<!--</style>-->

<template>
  <section class="add">
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="姓名" prop="teacherName">
        <el-input v-model="form.teacherName"></el-input>
      </el-form-item>
      <el-form-item label="学院" prop="institute">
        <el-input v-model="form.institute"></el-input>
      </el-form-item>
      <el-form-item label="性别" prop="sex">
        <el-input v-model="form.sex"></el-input>
      </el-form-item>
      <el-form-item label="电话号码" prop="tel">
        <el-input v-model="form.tel"></el-input>
      </el-form-item>
      <el-form-item label="密码" prop="pwd">
        <el-input v-model="form.pwd" type="password"></el-input>
      </el-form-item>
      <el-form-item label="身份证号" prop="cardId">
        <el-input v-model="form.cardId"></el-input>
      </el-form-item>
      <el-form-item label="职称" prop="type">
        <el-input v-model="form.type"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit()" icon="el-icon-a-07">立即创建</el-button>
        <el-button type="danger" @click="cancel()" icon="el-icon-a-022">取消</el-button>
      </el-form-item>
    </el-form>
  </section>
</template>

<script>
  export default {
    data() {
      return {
        form: {
          teacherName: null,
          institute: null,
          sex: null,
          tel: null,
          pwd: null,
          cardId: null,
          type: null
        },
        rules: {
          teacherName: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
          institute: [{ required: true, message: '请输入学院', trigger: 'blur' }],
          tel: [
            { required: true, message: '请输入电话号码', trigger: 'blur' },
            { pattern: /^[1][3,4,5,7,8][0-9]{9}$/, message: '电话号码格式不正确', trigger: 'blur' }
          ],
          pwd: [{ required: true, message: '请输入密码', trigger: 'blur' }],
          cardId: [
            { required: true, message: '请输入身份证号', trigger: 'blur' },
            { pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '身份证号格式不正确', trigger: 'blur' }
          ],
          type: [{ required: true, message: '请输入职称', trigger: 'blur' }]
        }
      };
    },
    methods: {
      onSubmit() {
        this.$refs.form.validate(valid => {
          if (valid) {
            this.$axios({
              url: '/api/teacher',
              method: 'post',
              data: {
                ...this.form
              }
            }).then(res => {
              if (res.data.code == 200) {
                this.$message({
                  message: '数据添加成功',
                  type: 'success'
                })
                this.$router.push({ path: '/teacherManage' })
              }
            })
          } else {
            this.$message.error('请填写完整的表单信息');
            return false;
          }
        });
      },
      cancel() {
        this.form = {};
      },
    }
  };
</script>

<style lang="less" scoped>
  .add {
    padding: 0px 40px;
    width: 400px;
  }
</style>


